<template>
  <div class="login">
    <el-form
      label-position="labelPosition"
      label-width="80px"
      :model="search"
      ref="loginForm"
    >
      <el-form-item label="账号">
        <el-input v-model="search.loginName"></el-input>
      </el-form-item>
      <el-form-item label="id">
        <el-input v-model="search.password"></el-input>
      </el-form-item>
      <el-form-item class="login-button">
        <el-button type="primary">登陆</el-button>
        <el-button type="primary">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script lang="ts">
import { defineComponent, reactive } from "vue";

import { LoginParams } from "./login.type";

export default defineComponent({
  name: "Login",

  setup(props, context) {
    const search = reactive<LoginParams>({} as LoginParams);
    console.log(props);
    console.log(context);
    return { search };
  },
});
</script>

<style lang="less" scoped>
  .login{
    .login-button{
      text-align: right;
    }
  }
</style>